<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册</title>
    <link rel="icon" href="../images/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="../css/rester.css">
    <link rel="stylesheet" href="../css/iconfont.css">
    <link rel="stylesheet" href="../css/register.css">
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="../js/jquery1.12.4.min.js"></script>
    <script src="../js/layer/dist/layer.js"></script>
    <script src="../js/register.js"></script>
    <script src="/layui/layui.js"></script>
</head>
<body>
<div id="header">
    <div class="h_inner container">
        <div class="logo">
            <img src="../images/HUAWEI.svg" alt="">
        </div>
        <div class="webname">
            <span class="line"></span>
            <b>华为商城</b>
        </div>
    </div>
</div>

    <div id="main">
        <div class="content">
            <div class="title">
                <p class="top">华为帐号注册</p>
                <p class="bottom">已有帐号， <a href="/login/">去登录<i class="iconfont icon-jiantou"></i></a></p>
            </div>
            <div class="tel_num box">
                <span>+86(中国)<i></i><em class="line"></em></span>
                <input type="number" placeholder="请输入手机号码" id="uname">
            </div>
            <div class="pw">
                <input type="text" id="username" placeholder="用户名" class="box">
            </div>
            <div class="messageTest">
                <input type="text" id="note" placeholder="短信验证码" class="box">
                <button class="get" id="sendBtn">获取验证码</button>
            </div>
            <div class="pw">
                <input type="password" id="pword" placeholder="密码" class="box">
                <i class="iconfont icon-biyan"></i>
            </div>
            <div class="pw">
                <input type="password" id="pword2" placeholder="确认密码" class="box">
                <i class="iconfont icon-biyan"></i>
                <div class="error">! 密码与确认密码不一致</div>
            </div>
            <button class="btn" id="register">注册</button>
        </div>
    </div>

<div id="footer" class="clearfix">
    <div class="f_inner">
        <p style="text-align: center;line-height:20px;height:20px;" class="top">
            <a href="#">华为帐号用户协议</a>
            <em class="foot_em">|</em>
            <a href="#">关于华为帐号与隐私的声明</a>
            <span><em class="foot_em">|</em> <a href="#">常见问题</a></span>
            <em class="foot_em">|</em>
            <a href="#">Cookies</a>
        </p>
        <p style="line-height: 12px;height:12px;margin-top: 10px; color: #000; opacity: 0.3;text-align:center;font-size: 14px;">
            华为帐号 版权所有 © 2011-2021
        </p>
    </div>
</div>

<script>
    layui.use(["layer"],function(){
        var layer = layui.layer;
        var $ = layui.jquery;
        /*var EY = document.querySelector("#eye1")*/
        var sta = true;

        $("#sendBtn").on("click",function (){
            //获取手机号码
            var tel = $("#uname").val();
            if (!tel){
                layer.msg("请输入手机号");
                return false;
            }
            var m = 60;
            var timer = null;

            var f = function (){
                m -= 1;
                if (m === 0){
                    $("#sendBtn").text("重新发送");
                    $("#sendBtn").prop("disabled",false);
                    clearInterval(timer);
                } else {
                    $("#sendBtn").text("重新发送"+ m + "s");
                }
            };
            $.post("/sendCode",{tel:tel},function (){
                $("#sendBtn").prop("disabled",true);
                timer = setInterval(f,1000);
                //禁用60秒
            })
        })


        $("#register").on("click",function (){
            var tel = $("#uname").val();
            console.log(tel)
            var username = $("#username").val();
            console.log(username)
            var pas = $("#pword").val();
            console.log(pas)
            var code = $("#note").val();
            console.log(code)
            $.post("/register/add",{tel:tel,pas:pas,code:code,uname:username},function (){
                window.location.href="/login";
            })
        })
    });
</script>

</body>
</html>